<template>
    <div class="order-list">
        <header>
            <van-nav-bar title="订单列表" left-text="返回" left-arrow @click-left="onClickLeft" />
        </header>

        <section>
            <ul>
                <li v-for="(item,index) in orderList" :key="index">
                    <van-card :num="item.t_num" tag="已支付" :price="item.t_price"  :title="item.g_name"
                        :thumb="item.g_pic"/>
                </li>
            </ul>
        </section>
    </div>
</template>

<script>
import {getOrderList } from '@/api/userAccount/order'

export default {

    data() {
        return{
            orderList: []
        }
    },
    created() {
        this.getOrders()
    },
    methods: {
        async getOrders() {
            const uName = localStorage.getItem('userName')
            const res = await getOrderList(uName)
            console.log(res);

            if(res.status === 200){
                this.orderList = res.data
                console.log(this.orderList);
                
            }else{
                this.$toast.fail(res.message)
            }
            
        },

        onClickLeft() {
            this.$router.push('/my')
        }
    }
}
</script>

<style scoped> 

section ul li {
    margin-top: 10px;
}
section ul li:first-child{
    margin-top: 0;
}
.van-card{
    padding: 16px;
    font-size: 15px;
}

</style>